//商品
import React, { Component } from 'react';
import axios from 'axios';
import {create_requestlist_action} from '../store/actionCreator'
import {connect} from 'react-redux'
import {withRouter} from 'react-router-dom'
class Commo extends Component {
    constructor(props){
        super(props);
        this.state = {
            item:{},
            componentDidMount(){
                if(this.props.goodlist.length ==0){
                    this.props.requestlist();
                }
            }
    //   goodList:[
    //       {
    //           id:0,
    //           img:"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8d009727-802e-43cf-8f79-bc9bebdce1e0/3b8e07b7-5f22-489c-a7a6-cd7aaa18495d.jpg",
    //           name:"水蜜桃",
    //           price:37.2,
    //           saled:24
    //       },{
    //           id:0,
    //           img:"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8d009727-802e-43cf-8f79-bc9bebdce1e0/3b8e07b7-5f22-489c-a7a6-cd7aaa18495d.jpg",
    //           name:"水蜜桃",
    //           price:12.2,
    //           saled:44
    //       },{
    //           id:0,
    //           img:"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8d009727-802e-43cf-8f79-bc9bebdce1e0/3b8e07b7-5f22-489c-a7a6-cd7aaa18495d.jpg",
    //           name:"水蜜桃",
    //           price:7.9,
    //           saled:88
    //       },{
    //           id:0,
    //           img:"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8d009727-802e-43cf-8f79-bc9bebdce1e0/3b8e07b7-5f22-489c-a7a6-cd7aaa18495d.jpg",
    //           name:"水蜜桃",
    //           price:7.21,
    //           saled:94
    //       },
    //       {
    //         id:0,
    //         img:"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8d009727-802e-43cf-8f79-bc9bebdce1e0/3b8e07b7-5f22-489c-a7a6-cd7aaa18495d.jpg",
    //         name:"水蜜桃",
    //         price:37.2,
    //         saled:24
    //     },{
    //         id:0,
    //         img:"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8d009727-802e-43cf-8f79-bc9bebdce1e0/3b8e07b7-5f22-489c-a7a6-cd7aaa18495d.jpg",
    //         name:"水蜜桃",
    //         price:12.2,
    //         saled:44
    //     },
    
    //   ],
    //         i:0,
    
        }
    }
     
    
    // handleClick(index){
      
    //   this.setState({
    //       i: index,
    //       goodList:this.state.goodList,
          
    //   },()=>{
    //          console.log(this.state.i);
    //      })
    // }
    // componentDidMount(){
    //     console.log(this.props);
    //     axios.post("/api/commo",{id:this.props.location.state.id}).then((res)=>{
    //         this.setState({
    //             item:res.data
    //         })
    //     })
    // }
    render() {
        return (
            <div className="commo">
                <div className="list">
                    {
                        this.props.goodlist.map((item,index)=>{
                            return (
                                <div onClick={()=>{ this.props.history.push({ pathname:'/aarticulars', state:{ id: item.id } }) }} key={index} className="item">
                                    <img src={item.icon} alt="" />
                                    <p>{item.name}</p>
                                    <p>原价 ¥ {item.price}</p>
                                    <p>抢购价 ¥ {item.saled}</p>
                                </div>
                            )
                        })
                    }
                </div>
                {/* <div className="goodList"> */}
                    {/* {
                        this.state.goodList.map((item,index)=>{
                            return( */}
                                {/* <div key={index} className="good"> */}
                                    {/* <img src={this.state.item.icon} alt="" />
                                    <p>{this.state.item.name}</p>
                                    <p>原件： {this.state.item.price}</p>
                                    <p>抢购价： {this.state.item.oldprice}</p> */}
                                {/* </div> */}
                            {/* )
                        })
                    } */}
                {/* </div> */}
            </div>
        );
    }
}

export default withRouter( connect((state)=>{
    return{
        goodlist:state.goodlist
    }
},(dispatch)=>{
    return{
        requestlist:()=>{
            dispatch(create_requestlist_action())
        }
    }
})(Commo));